<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>程序员Rain的学习日记</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <header>
        <h1>程序员Rain的学习日记</h1>
        <nav>
            <ul>
                <li><a href="#home">首页</a></li>
                <li><a href="#about">关于我</a></li>
                <li><a href="#diary">日记</a></li>
                <li><a href="#contact">联系我</a></li>
            </ul>
        </nav>
    </header>

    <main>
        <section id="home">
            <h2>欢迎来到我的学习日记</h2>
            <p>记录我作为程序员的成长历程、学习心得和技术分享。</p>
            <img src="https://picsum.photos/800/400" alt="学习场景占位图">
        </section>

        <section id="about">
            <h2>关于我</h2>
            <p>我是Rain，一名热爱编程的程序员，专注于Web开发和新技术探索。</p>
            <img src="https://picsum.photos/300/300" alt="个人头像占位图">
        </section>

        <section id="diary">
            <h2>学习日记</h2>
            <article>
                <h3>日记条目1: 学习HTML和CSS</h3>
                <p>今天学习了响应式设计的基础，使用Flexbox布局创建了一个简单的页面。Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
                <p>日期: 2023-10-01</p>
            </article>
            <article>
                <h3>日记条目2: JavaScript入门</h3>
                <p>开始学习JavaScript的DOM操作，实现了一些交互功能。Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                <p>日期: 2023-10-05</p>
            </article>
            <!-- 更多日记条目可以动态添加 -->
        </section>

        <section id="contact">
            <h2>联系我</h2>
            <form id="contact-form">
                <label for="name">姓名:</label>
                <input type="text" id="name" name="name" required>
                <label for="email">邮箱:</label>
                <input type="email" id="email" name="email" required>
                <label for="message">消息:</label>
                <textarea id="message" name="message" required></textarea>
                <button type="submit">发送</button>
            </form>
        </section>
    </main>

    <footer>
        <p>&copy; 2023 程序员Rain. 保留所有权利.</p>
    </footer>

    <script src="script.js"></script>
</body>
</html>